{extend name="base" /}

{block name="box"}
<div class="layui-container fly-marginTop">
  <div class="fly-panel" pad20 style="padding-top: 5px;">
    <!--<div class="fly-none">没有权限</div>-->
    <div class="layui-form layui-form-pane">
      <div class="layui-tab layui-tab-brief" lay-filter="user">
        <ul class="layui-tab-title">
          <li class="layui-this">发表新帖<!-- 编辑帖子 --></li>
        </ul>
        <div class="layui-form layui-tab-content" id="LAY_ucm" style="padding: 20px 0;">
          <div class="layui-tab-item layui-show">
            <form action="{{:url('Card/send')}}" id="newCard" method="post" enctype="multipart/form-data">
              <div class="layui-row layui-col-space15 layui-form-item">
                <div class="layui-col-md3">
                  <label class="layui-form-label">所在专栏</label>
                  <div class="layui-input-block">
                    <!-- 显示所有帖子分类 -->
                    {if condition="!empty($cateInfo)"}
                      <select lay-verify="required" name="class" id="category" lay-filter="column">
                        <option value="">请选择帖子分类</option> 
                        {foreach name="cateInfo" item="val"}
                          <option value="{{$val.id}}">{{$val.category_name}}</option>
                        {/foreach}
                      </select>
                    {/if}
                    

                  </div>
                </div>
                <div class="layui-col-md9">
                  <label for="L_title" class="layui-form-label">标题</label>
                  <div class="layui-input-block">
                    <input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input" placeholder="限制30个汉字以内">
                    <!-- <input type="hidden" name="id" value="{{d.edit.id}}"> -->
                  </div>
                </div>
              </div>

              <div class="layui-form-item layui-form-text">
                <label for="L_title" class="layui-form-label">帖子内容</label>
                <!-- 加载编辑器的容器 -->
                <div class="layui-input-block ueditor1" style="z-index: 998">
                   <script id="container" name="content1" type="text/plain" style="height: 300px;" ></script>
                </div>
                
              </div>
              <div class="layui-form-item" id="gold" style="display: none;">
                <div class="layui-inline">
                  <label class="layui-form-label">悬赏金币</label>
                  <div class="layui-input-inline" style="width: 190px;">
                    <input type="number" name="gold"  autocomplete="off" class="layui-input">
                    <input type="hidden" name="mygold" value="{{$userInfo.gold}}">
                  </div>
                  <div class="layui-form-mid layui-word-aux">发表后无法更改金币</div>
                </div>
              </div>
              <div class="layui-form-item">
                <label for="L_vercode" class="layui-form-label">人类验证</label>
                <div class="layui-input-inline">
                  <input type="text" id="L_vercode" name="vercode" required lay-verify="required" placeholder="请输入后面的验证码" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-form-mid">
                  <!-- <span style="color: #c00;">1+1=?</span> -->
                  <img src="{{:captcha_src()}}" alt="captcha" style="height: 38px;margin-top: -8px" onclick="this.src=this.src+'?i='+Math.random()"/>
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-inline">
                    <button class="layui-btn"  lay-submit>立即发布</button>
                </div>
                <span></span>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="fly-footer">
  <p><a href="http://fly.layui.com/" target="_blank">Fly社区</a> 2017 &copy; <a href="http://www.layui.com/" target="_blank">layui.com 出品</a></p>
  <p>
    <a href="http://fly.layui.com/jie/3147/" target="_blank">付费计划</a>
    <a href="http://www.layui.com/template/fly/" target="_blank">获取Fly社区模版</a>
    <a href="http://fly.layui.com/jie/2461/" target="_blank">微信公众号</a>
  </p>
</div>
<!-- 配置文件 -->
    <script type="text/javascript" src="__STATIC__/ueditor/ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" src="__STATIC__/ueditor/ueditor.all.js"></script>
    <!-- 实例化编辑器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');
    </script>
<script>
    var check_gold = false;
    $(function(){
        // console.log($("#category").val());
        // console.log("cate");
        if($("#category").val() == 1){
            $("#gold").removeProp("style");
        }else{
            check_gold = true;
        }
    })
    
    layui.use('form', function(){
      var form = layui.form;
      form.on('select(column)', function(data){
        // console.log($("#edui1_wordcount").html());
        // console.log($("div.ueditor1").html());

          if(data.value == 1){
            // console.log($("#gold").html());
            $("#gold").removeProp("style");
        }else{
            $("#gold").prop("style","display:none");
            check_gold = true;
        }
    }); 
      //各种基于事件的操作，下面会有进一步介绍
    });
    

    //检查标题长度小于30
    var check_title = false;
    $("#L_title").blur(function(){
        var title = $("#L_title").val();
        if(title.length > 30){   
            $("button").parent().next().removeClass("layui-word-aux").css("color","red");
            $("button").parent().next().html("标题不能超过30个字!!!");
            error("标题不能超过30个字");
            check_title = false;
        }else{
            $("button").parent().next().html("");
            check_title = true;
        }
    })

    //检查金币数量小于该用户拥有的最大金币数
    $("input[name='gold']").blur(function(){
        //用户拥有的金币
        var gold = parseInt($("input[name='gold']").val());
        var mygold = parseInt($("input[name='mygold']").val());
        if(gold > mygold){
            $("input[name='gold']").parent().next().removeClass("layui-word-aux").css("color","red");
            $("input[name='gold']").parent().next().html("对不起,您的金币现在只有"+mygold+",不足"+gold+"!!!");
            check_gold = false;
            // error("对不起,您的金币现在只有"+mygold+",不足"+gold);
        }else{
            $("input[name='gold']").parent().next().addClass("layui-word-aux");
            $("input[name='gold']").parent().next().html("发表后无法更改金币");
            check_gold = true;
        }

    })

    //如果标题长度或金币不符合,就不能提交
    $("#newCard").submit(function(){
        console.log(check_gold);
        console.log(check_title);
        if(check_gold && check_title){
            return true;
        }else{
            return false;
        }
    })

    function error (contents){
        layer.open({
               title: '错误提示',
               content: contents
            }); 
    }
</script>
{/block}